<template>
  <view class="dispose-list-page">
    <view
      class="dispose-card"
      v-for="item in disposalList"
      :key="item.disposal_code"
    >
      <view class="card-header">
        <view class="status-tag" :class="getStatusClass(item.state_name)">
          {{ item.state_name }}
        </view>
        <view class="bill-code">{{ item.disposal_code }}</view>
        <view class="card-menu">···</view>
      </view>
      <view class="info-row">
        <text class="label">单据名称</text>
        <text class="value">{{ item.disposal_order_name }}</text>
      </view>
      <view class="info-row">
        <text class="label">处置资产</text>
        <text class="value">{{ item.asset_names }}</text>
      </view>
      <view class="info-row">
        <text class="label">处置人</text>
        <text class="value">{{ item.disposal_user_name }}</text>
        <text class="label" style="margin-left: 40rpx;">处置日期</text>
        <text class="value">{{ item.disposal_date }}</text>
      </view>
			<view class="action-row">
				<!-- 所有状态都有详情和审核记录 -->
				<up-button 
					type="primary"
					plain
					size="medium"
					text="详情"
					@click="onDetail(item)"
					:customStyle="btnStyle"
				></up-button>
				
				<up-button 
					type="primary"
					plain
					size="medium"
					text="审核记录"
					@click="goToAudit(item)"
					:customStyle="btnStyle"
				></up-button>

				<!-- 待审核或驳回状态：修改、删除 -->
				<template v-if="item.state_name === '待审核' || item.state_name === '驳回'">
					<up-button 
						type="warning"
						plain
						size="medium"
						text="修改"
						@click="onEdit(item)"
						:customStyle="btnStyle"
					></up-button>
					
					<up-button 
						type="error"
						plain
						size="medium"
						text="删除"
						@click="onDelete(item)"
						:customStyle="btnStyle"
					></up-button>
				</template>

				<!-- 待审核状态：审核 -->
				<up-button 
					v-if="item.state_name === '待审核'"
					type="success"
					size="medium"
					text="审核"
					@click="onAudit(item)"
					:customStyle="{...btnStyle, background: '#19be6b', color: '#fff'}"
				></up-button>

				<!-- 审核通过状态：反审、确定 -->
				<template v-if="item.state_name === '审核通过'">
					<up-button 
						type="warning"
						size="medium"
						text="反审"
						@click="onUnAudit(item)"
						:customStyle="{...btnStyle, background: '#ff9900', color: '#fff'}"
					></up-button>
					
					<up-button 
						type="success"
						size="medium"
						text="确定"
						@click="onConfirm(item)"
						:customStyle="{...btnStyle, background: '#19be6b', color: '#fff'}"
					></up-button>
				</template>
			</view>
    </view>
  </view>
</template>

<script setup>
import { defineProps } from "vue";
import http from "@/api/request";

// 在script中定义按钮样式
const btnStyle = {
  flex: 1,
  minWidth: '150rpx',
  height: '80rpx',
  fontSize: '32rpx',
  margin: '0 10rpx',
  borderRadius: '12rpx',
  borderWidth: '2rpx',
  fontWeight: 'bold'
}

// 假设外部通过 props 传入 disposalList
const props = defineProps({
  disposalList: {
    type: Array,
    default: () => []
  }
});

function getStatusClass(status) {
  if (status === '完成') return 'status-done';
  if (status === '审核通过') return 'status-pass';
  if (status === '驳回') return 'status-reject';
  if (status === '待审核') return 'status-pending';
  return 'status-other';
}

function goToAudit(item) {
  uni.navigateTo({
    url: `/pages/assetsDisposal/auditRecord?disposalCode=${item.disposal_code}`
  });
}

function onDetail(item) {
  uni.navigateTo({
    url: `/pages/assetsDisposal/detail?disposalCode=${item.disposal_code}`
  });
}

function onEdit(item) {
  uni.navigateTo({
    url: `/pages/assetsDisposal/add?disposalCode=${item.disposal_code}`
  });
}

function onAudit(item) {
  // 跳转到详情页面并带上审核标识
  uni.navigateTo({
    url: `/pages/assetsDisposal/detail?disposalCode=${item.disposal_code}&mode=audit`
  });
}

function onUnAudit(item) {
  // 反审逻辑
  uni.showModal({
    title: '反审确认',
    content: `确定反审处置单 ${item.disposal_code} 吗？`,
    cancelText: '取消',
    confirmText: '确定',
    success: (res) => {
      if (res.confirm) {
        // 调用反审接口
        submitUnAudit(item.disposal_code);
      }
    }
  });
}

// 提交反审结果
function submitUnAudit(disposalCode) {
  uni.showLoading({
    title: '提交中...'
  });
  
  const data = { 
    "pageCode": "assetdisposal", 
    "params": { 
      "args": [ 
        { 
          "name": "interfaceCode", 
          "value": "assetdisposal.auditAssetDisposalOrder" 
        }, 
        { 
          "name": "disposalCode", 
          "value": disposalCode 
        }, 
        { 
          "name": "auditState", 
          "value": "PENDING_REVIEW" 
        } 
      ] 
    }, 
    "methodName": "auditAssetDisposalOrder" 
  };
  
  http.post("/api/module/Invoke", data).then((res) => {
    uni.hideLoading();
    if (res.isSuccess) {
      uni.showToast({
        title: '反审成功',
        icon: 'success'
      });
      
      // 延迟一下再刷新页面，确保提示显示完成
      setTimeout(() => {
        // 使用全局事件通知父组件刷新数据
        uni.$emit('data-changed');
      }, 1000);
    } else {
      uni.showToast({
        title: res.error || '操作失败',
        icon: 'none'
      });
    }
  }).catch(err => {
    uni.hideLoading();
    console.error('反审操作失败:', err);
    uni.showToast({
      title: '网络异常，请稍后重试',
      icon: 'none'
    });
  });
}

function onConfirm(item) {
  // 确定逻辑
  uni.showModal({
    title: '确认',
    content: `确定完成处置单 ${item.disposal_code} 吗？`,
    cancelText: '取消',
    confirmText: '确定',
    success: (res) => {
      if (res.confirm) {
        // 调用确定接口
        submitConfirm(item.disposal_code);
      }
    }
  });
}

// 提交确认结果
function submitConfirm(disposalCode) {
  uni.showLoading({
    title: '提交中...'
  });
  
  const data = { 
    "pageCode": "assetdisposal", 
    "params": { 
      "args": [ 
        { 
          "name": "interfaceCode", 
          "value": "assetdisposal.auditAssetDisposalOrder" 
        }, 
        { 
          "name": "disposalCode", 
          "value": disposalCode 
        }, 
        { 
          "name": "auditState", 
          "value": "COMPLETED" 
        } 
      ] 
    }, 
    "methodName": "auditAssetDisposalOrder" 
  };
  
  http.post("/api/module/Invoke", data).then((res) => {
    uni.hideLoading();
    if (res.isSuccess) {
      uni.showToast({
        title: '确认成功',
        icon: 'success'
      });
      
      // 延迟一下再刷新页面，确保提示显示完成
      setTimeout(() => {
        // 使用全局事件通知父组件刷新数据
        uni.$emit('data-changed');
      }, 1000);
    } else {
      uni.showToast({
        title: res.error || '操作失败',
        icon: 'none'
      });
    }
  }).catch(err => {
    uni.hideLoading();
    console.error('确认操作失败:', err);
    uni.showToast({
      title: '网络异常，请稍后重试',
      icon: 'none'
    });
  });
}

function onDelete(item) {
  // 删除逻辑
  uni.showModal({
    title: '删除确认',
    content: `确定删除处置单 ${item.disposal_code} 吗？`,
    cancelText: '取消',
    confirmText: '确定',
    success: (res) => {
      if (res.confirm) {
        // 显示加载中
        uni.showLoading({
          title: '删除中...'
        });
        
        // 构建请求参数
        const data = { 
          "pageCode": "assetdisposal", 
          "params": { 
            "args": [ 
              { 
                "name": "interfaceCode", 
                "value": "assetdisposal.softDeleteAssetDisposalOrder" 
              }, 
              { 
                "name": "disposalCode", 
                "value": item.disposal_code 
              } 
            ] 
          }, 
          "methodName": "softDeleteAssetDisposalOrder" 
        };
        
        // 调用删除接口
        http.post("/api/module/Invoke", data).then((res) => {
          uni.hideLoading();
          if (res.isSuccess) {
            uni.showToast({
              title: '删除成功',
              icon: 'success'
            });
            
            // 延迟一下再刷新页面，确保提示显示完成
            setTimeout(() => {
              // 使用全局事件通知父组件刷新数据
              uni.$emit('data-changed');
            }, 1000);
          } else {
            uni.showToast({
              title: res.error || '删除失败',
              icon: 'none'
            });
          }
        }).catch(err => {
          uni.hideLoading();
          console.error('删除操作失败:', err);
          uni.showToast({
            title: '网络异常，请稍后重试',
            icon: 'none'
          });
        });
      }
    }
  });
}
</script>

<style scoped>
.dispose-list-page {
  background: #f5f5f5;
  min-height: 100vh;
  padding: 20rpx 0;
}
.dispose-card {
  background: #fff;
  border-radius: 16rpx;
  margin: 20rpx;
  padding: 24rpx 28rpx 18rpx 28rpx;
  box-shadow: 0 2rpx 8rpx rgba(0,0,0,0.05);
}
.card-header {
  display: flex;
  align-items: center;
  margin-bottom: 16rpx;
}
.status-tag {
  font-size: 24rpx;
  padding: 4rpx 16rpx;
  border-radius: 8rpx;
  margin-right: 16rpx;
  background: #e6f9f0;
  color: #2ecc71;
}
.status-done {
  background: #e6f9f0;
  color: #2ecc71;
}
.status-pass {
  background: #e6f7ff;
  color: #1890ff;
}
.status-reject {
  background: #fff2e8;
  color: #fa541c;
}
.status-pending {
  background: #f9f0ff;
  color: #722ed1;
}
.status-other {
  background: #f5f5f5;
  color: #666;
}
.bill-code {
  font-weight: bold;
  font-size: 30rpx;
  flex: 1;
}
.card-menu {
  font-size: 36rpx;
  color: #bbb;
}
.info-row {
  display: flex;
  align-items: center;
  margin-bottom: 10rpx;
}
.label {
  color: #888;
  font-size: 26rpx;
  margin-right: 12rpx;
}
.value {
  color: #333;
  font-size: 28rpx;
  margin-right: 12rpx;
}
/* 操作按钮容器样式 */
.action-row {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin-top: 30rpx;
  padding-top: 30rpx;
  border-top: 2rpx solid #f0f0f0;
  gap: 20rpx;
}

/* 按钮点击效果 */
.up-button--active {
  opacity: 0.8;
  transform: scale(0.98);
  transition: all 0.2s;
}
</style>
  